<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>CSS Writing Modes Test: text-orientation - upright in vertical-rl writing mode</title>
		<link rel="author" title="Kazuaki Takemura" href="mailto:takemura@networksoft.co.jp" />
		<link rel="help" title="5.1.  Orienting Text" href="http://www.w3.org/TR/css-writing-modes-3/#text-orientation" />
		<link rel="match" href="reference/text-orientation-upright-001-ref.xht" />
		<meta name="flags" content="font image" />
		<meta name="assert" content="This test checks that the alphabet is displayed on the upright (not sideways),and it is verified whether the characters are aligned in the vertical direction including vertical writing characters(Japanese, Mongolian, Hangul, etc)." />
		<style type="text/css"><![CDATA[
			@font-face
			{
				font-family: "DejaVuSerifBook";
				src: url("support/DejaVuSerif-webfont.woff") format("woff");
				/* Filesize: 18096 bytes (17.7 KBytes) */
			}

			div {
				border: 1px solid gray;
				float: left;
				color: blue;
				font-family: "DejaVuSerifBook";
				font-size: 1.875em; /* equivalent to 30px */
				line-height: 1.4; /* equivalent to 42px:
				so that top-half-leading is 6px
				and bottom-half-leading is 6px */
				margin: 10px;
			}

			div#vertical
			{
				-webkit-writing-mode: 		vertical-rl;
				-moz-writing-mode: 			vertical-rl;
				-o-writing-mode: 			vertical-rl;
				-ms-writing-mode:			vertical-rl;
				writing-mode: 				vertical-rl;
				-webkit-text-orientation:   upright;
				-moz-text-orientation:   	upright;
				-o-text-orientation:   		upright;
				-ms-text-orientation:		mixed;
				text-orientation:   		upright;
			}

		    img {vertical-align: top;}

		]]></style>
	</head>
	<body>

	<p>Test passes if both "Text sample" rectangles
		have the <strong>same order</strong>, the <strong>same orientation</strong> and the <strong>same layout</strong>:
		"Text sample" should be displayed on the upright.</p>

	<div id="vertical">Ｔext sample</div>

	<div><img src="./support/text-orientation-upright-001.png" width="42" height="349" alt="Image download support must be enabled" /></div>

	</body>
</html>
